<template>
  <el-table
    ref="table"
    v-loading="loading"
    :row-key="rowKey"
    :data="data"
    :border="border"
    :stripe="stripe"
    :height="tableHeight"
    :max-height="tableMaxHeight"
    :class="[className]"
    style="width: 100%"
    highlight-current-row
    @row-click="rowClick"
    @row-dblclick="rowDblclick"
    @cell-click="cellClick"
    @cell-dblclick="cellDblclick"
    @select="select"
    @select-all="selectAll"
    @selection-change="selectionChange"
  >
    <slot></slot>
  </el-table>
</template>

<script>
import { defineComponent } from 'vue'
export default defineComponent({
  name: 'c-table',
  props: {
    //表格数据
    data: {
      type: Array,
      default: function () {
        return []
      }
    },
    rowKey: {
      type: String,
      default: () => {
        return ''
      }
    },
    //边框
    border: {
      type: Boolean,
      default: false
    },
    //斑马纹
    stripe: {
      type: Boolean,
      default: false
    },
    //表格高度
    tableHeight: {
      type: [Number, String],
      default: '100%'
    },
    //表格最大高度
    tableMaxHeight: {
      type: Number,
      default: null
    },
    //loading动画
    loading: {
      type: Boolean,
      default: false
    },
    //样式
    className: {
      type: Object,
      default: null
    }
  },
  activated() {
    this.$nextTick(() => {
      /* 切换隐藏时 处理固定列错位 */
      this.$refs.table.doLayout()
    })
  },
  methods: {
    rowClick(row, column, event) {
      this.$emit('row-click', row, column, event)
    },
    rowDblclick(row, column, event) {
      this.$emit('row-dblclick', row, column, event)
    },
    select(selection, row) {
      this.$emit('select', selection, row)
    },
    selectAll(selection) {
      this.$emit('select-all', selection)
    },
    selectionChange(selection) {
      this.$emit('selection-change', selection)
    },
    cellClick(row, column, cell, event) {
      this.$emit('cell-click', row, column, cell, event)
    },
    cellDblclick(row, column, cell, event) {
      this.$emit('cell-dblclick', row, column, cell, event)
    }
  }
})
</script>

<style scoped></style>
